<template>
	<view class="">
		<navBar title="切盘检"></navBar>
		<handling :text="text" @statusdetails="statusdetails"></handling>
		<tableList :pageTurning="pageTurning" :dataList="dataList" :selectionBox="status === 1 ? true : false"
			@particulars="particularsUrl" @multiParticulars="multiParticularsUrl">
		</tableList>
		<view class="w-100% h-500rpx" v-if="status === 1">
		</view>
		<view class="suctionbottomTwo" v-if="status === 1">
			<subtitle titleText="工序批量切盘检"></subtitle>
			<view class="w-100% ml-32rpx mr-32rpx">
				<view class="mt-24rpx mb-32rpx select flex-space-between">
					<view class="">
						工序选择
					</view>
				</view>
				<u-radio-group v-model="process" @change="radioChange">
					<u-radio class="mb-30rpx" v-for="(item, index) in selectlist" :key="index" :name="item.value"
						:disabled="item.disabled">
						<view class="w-146rpx select2">
							{{ item.name }}
						</view>
					</u-radio>
				</u-radio-group>
			</view>
			<view class="w-100% h-1rpx" style="background: #EEEEEE;"></view>
			<view v-if="processDescsingle && status === 1" class="yes button" @click="upload">
				工序批量切盘检
			</view>
			<view class="no button" @click="uploadMistake" v-if="!processDescsingle && status === 1">
				工序批量切盘检
			</view>
		</view>
	</view>
</template>

<script lang="ts" setup>
import navBar from '@/components/navbar.vue'
import tableList from '@/components/tableList.vue'
import handling from '@/components/handling.vue'
import subtitle from '@/components/subtitle.vue'
import { selectPadTask, queryDictInfo } from '@/common/api/operationApi'
import { onShow, onReachBottom } from "@dcloudio/uni-app"
import { ref, watch } from 'vue'

const dataList = ref<string[]>([])
const text = ref<any>({
	text1: '待办',
	text2: '已办'
})
const status = ref<number>(1)
const statusdetails = (val: any) => {
	status.value = val
	tabList()
}
onShow(() => {
	page.value = 1
	tabList()
	select()
})
const pageTurning = ref<boolean>(false)
onReachBottom(() => {
	if (numberpages.value >= page.value) {
		page.value++
		selectPadTask({
			status: status.value,
			taskType: 12,
			page: page.value,
			size: size.value,
			processCode: processCode.value
		}).then((data) => {
			dataList.value.push(...data.items)
			data.items.length === 20 ? pageTurning.value = true : pageTurning.value = false
		})
	}
})
watch(
	() => status.value,
	() => {
		radioChange(processCode.value)
	},
	{ deep: true }
);
const page = ref<number>(1)
const size = ref<number>(20)
const numberpages = ref<number>()
const processCode = ref<number>(0)
async function tabList(): Promise<void> {
	const data = await selectPadTask({
		status: status.value,
		taskType: 12,
		page: page.value,
		size: size.value,
		processCode: processCode.value
	})
	dataList.value = data.items
	numberpages.value = Math.ceil(data.count / size.value)
	data.items.length === 20 ? pageTurning.value = true : pageTurning.value = false
}
const selectlist = ref<string[]>([])
async function select() {
	const dataselect = await queryDictInfo({
		taskType: 12
	})
	selectlist.value = dataselect
}

function particularsUrl(prodWork: string[], processDesc: string, id: string[]) {
	var url = ''
	if (status.value === 1) {
		url = `/pages/DiscCuttingInspection/needToBeDealtWith?processDesc=${processDesc}&prodWorkList=${prodWork}&id=${id}`
	} else {
		url = `/pages/DiscCuttingInspection/alreadyHandled?processDesc=${processDesc}&prodWorkList=${prodWork}&id=${id}`
	}
	uni.navigateTo({
		url: url
	});
}
const process = ref<number>()
function radioChange(e) {
	if (processCode.value === e) {
		process.value = 0
		processCode.value = 0
		page.value = 1
	} else {
		processCode.value = e
		page.value = 1
	}
	tabList()
}
const processDescsingle = ref<boolean>()
const processDesc = ref<string>()
const prodWorkList = ref<string>()
const listId = ref<string>()

function multiParticularsUrl(a, b, c, d) {
	processDescsingle.value = a
	processDesc.value = b
	prodWorkList.value = c
	listId.value = d
	if (processDesc.value === undefined) {
		processDescsingle.value = false
	}
}
function upload() {
	var url = ''
	if (processDescsingle.value) {
		if (status.value === 1) {
			url = `/pages/DiscCuttingInspection/needToBeDealtWith?processDesc=${processDesc.value}&prodWorkList=${prodWorkList.value}&id=${listId.value}`
		} else {
			url = `/pages/DiscCuttingInspection/alreadyHandled?processDesc=${processDesc.value}&prodWorkList=${prodWorkList.value}&id=${listId.value}`
		}
	} else {
		uni.showToast({
			title: '请选择相同工艺的进行批量检',
			icon: 'none',
		});
	}
	uni.navigateTo({
		url: url
	});
}
function uploadMistake() {
	if (processDesc.value !== undefined && processDesc.value.length > 0) {
		if (!processDescsingle.value) {
			uni.showToast({
				title: '请选择相同工艺的进行批量检',
				icon: 'none',
			});
		} else {

		}
	} else {
		uni.showToast({
			title: '请选择订单',
			icon: 'none',
		});
		processDescsingle.value = false
	}
}
</script>

<style scoped>
.suctionbottomTwo {
	width: 100%;
	position: fixed !important;
	background-color: #fff;
	bottom: 0;
	display: flex !important;
	align-items: center !important;
	z-index: 198;
	flex-wrap: wrap;
	justify-content: flex-start;
	box-shadow: 0px 2rpx 10rpx 0px rgba(207, 207, 207, 0.5);
}

.suctionbottomTwo .button {
	margin: 16rpx 24rpx 16rpx;
	width: 100%;
	height: 88rpx;
	border-radius: 4rpx;
	font-size: 32rpx;
	font-family: PingFangSC-Semibold, PingFang SC;
	font-weight: 600;
	line-height: 84rpx;
	text-align: center;
}

.suctionbottomTwo .yes {
	background: #2F7BFF;
	border: 1rpx solid #2F7BFF;
	color: #FFFFFF;
}

.suctionbottomTwo .yes:active {
	background: #99beff;
	border: 1rpx solid #99beff;
	color: #FFFFFF;
}

.suctionbottomTwo .no {
	background: #99beff;
	border: 1rpx solid #99beff;
	color: #FFFFFF;
}

.select {
	font-size: 26rpx;
	font-family: PingFangSC-Medium, PingFang SC;
	font-weight: 500;
	color: #4B4D55;
}

.select2 {
	font-size: 26rpx;
	font-family: PingFangSC-Medium, PingFang SC;
	font-weight: 400;
	color: #4B4D55;
}

::v-deep .u-radio__icon-wrap {
	width: 32rpx !important;
	height: 32rpx !important;
}
</style>